<template>
	<om-page :title="pageTitle">
		<view style="z-index: 0;">
			<!-- #ifdef H5 -->
			<tui-tabs isFixed :tabs="vTabs" bgColor="#7ab2ee" sliderBgColor="#5697F4" selectedColor="#5697F4"
				:currentTab="currentTab > 1 ? 0 : currentTab" @change="change" itemWidth="50%"></tui-tabs>
			<!-- #endif -->
			<!-- #ifndef H5 -->
			<tui-tabs :tabs="vTabs" bgColor="#e2eeee" sliderBgColor="#5697F4" selectedColor="#5697F4"
				:currentTab="currentTab > 1 ? 0 : currentTab" @change="change" itemWidth="50%"></tui-tabs>
			<!-- #endif -->
			<!-- #ifdef H5 -->
			<view style="height: 40px"></view>
			<!-- #endif -->
			<view v-if="currentTab === 0">
				<om-formpage :scrollTop="scrollTop" :forAll="false" :useThemeColor="false" :searchMaxLength="10"
					@confirm="searchClick" :datas="datas" :userid="userId">
					<template slot="header">
						<view>已加载 {{ datas.length }} 条数据</view>
					</template>
				</om-formpage>
			</view>
			<view v-else>
				<om-formpage :scrollTop="scrollTop" :forAll="false" :useThemeColor="false" :hasSearch="false"
					:datas="datas" :userid="userId">
					<template slot="header">
						<view>已加载 {{ datas.length }} 条数据</view>
					</template>
				</om-formpage>
			</view>
		</view>
		<uni-fab horizontal="right" @trigger="trigger" direction="vertical" :content="buttons" :scrollTop="scrollTop" />
		<tui-loadmore :visible="loadding"></tui-loadmore>
		<tui-nomore :visible="!pullUpOn"></tui-nomore>
	</om-page>
</template>

<script>
	import {
		mapState
	} from 'pinia';
	import {
		useLoginUserStore
	} from '@/stores/login-user.js';
	const app = getApp();
	export default {
		data() {
			return {
				buscode: 'HRS1201',
				searchStr: '',
				datas: [],
				total: 0,
				page: 0,
				scrollTop: 0,
				currentTab: 0,
				vTabs: [{
						name: '已参与',
						badgeText: 0
					},
					{
						name: '待处理',
						badgeText: 0
					}
				],
				buttons: [app.globalData.button.home],
				loadding: false,
				pullUpOn: true,
				pageTitle: ""
			};
		},
		computed: mapState(useLoginUserStore, ['userId']),
		methods: {
			trigger(e) {
				if (e.item.text === '返回首页') {
					uni.switchTab({
						url: '/pages/main/main/main'
					});
				} else if (e.item.text === '返回顶部') {
					this.scrollTop = 0;
					uni.pageScrollTo({
						scrollTop: 0
					});
				}
			},
			change(e) {
				this.currentTab = e.index;
				this.reloadData();
			},
			searchClick() {
				let _that = this;
				_that.searchStr = event.currentTarget.value;
				_that.reloadData();
			},
			reloadData: function() {
				let _that = this;
				_that.total = 0;
				_that.datas = [];
				_that.scrollTop = 0;
				_that.page = 0;
				_that.loadding = false;
				_that.pullUpOn = true;
				let func = '';
				if (_that.currentTab == 0) {
					func = 'Launch';
				} else {
					func = 'Pending';
				}
				return _that.loadData(func);
			},
			loadData: function(func) {
				let _that = this;
				if (_that.page * app.globalData.pageNum >= _that.total && _that.total != 0) {
					_that.pullUpOn = false;
					_that.loadding = false;
					return new Promise(resolve => {
						resolve();
					});
				}
				return _that['get' + func + 'Total']()
					.then(res => {
						if (_that.verifyStop(func)) {
							return new Promise(resolve => {
								resolve();
							});
						}
						_that.total = res.value;
						return _that['get' + func + 'List']();
					})
					.then(res => {
						if (_that.verifyStop(func)) {
							return new Promise(resolve => {
								resolve();
							});
						}
						if (_that.datas.length && res.value.length) {
							_that.datas = [..._that.datas, ...res.value];
						} else if (!_that.datas.length && res.value.length) {
							_that.datas = res.value;
						}
						if (_that.datas.length < _that.total) {
							_that.page = _that.page + 1;
						} else {
							_that.pullUpOn = false;
						}
						return new Promise(resolve => {
							resolve();
						});
					});
			},
			verifyStop(func) {
				if (func == 'Launch' && this.currentTab == 1) {
					return true
				} else if (func == 'Pending' && this.currentTab == 0) {
					return true
				} else {
					return false
				}
			},
			getLaunchTotal() {
				let _that = this;
				return _that.om.request('wxCommon/getLaunchTotal', {
					busCode: _that.buscode,
					zuserName: _that.searchStr
				}, "get");
			},
			getLaunchList() {
				return this.om.request('wxCommon/getLaunches', {
					busCode: this.buscode,
					zuserName: this.searchStr,
					page: this.page + 1,
					rows: app.globalData.pageNum
				});
			},
			getPendingTotal() {
				let _that = this;
				return _that.om.request('wxCommon/getPendingTotal', {
					busCode: _that.buscode,
					zuserName: _that.searchStr
				}, "get", true);
			},
			getPendingList() {
				return this.om.request('wxCommon/getPendingList', {
					busCode: this.buscode,
					zuserName: this.searchStr,
					page: this.page + 1,
					rows: app.globalData.pageNum
				});
			}
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			uni.removeStorage({
				key: this.serviceJs.flowChangeCache
			})
			this.pageTitle = (options.title || '') + '历史记录'
			uni.setNavigationBarTitle({
				title: this.pageTitle
			});
			this.buscode = (options.code || this.buscode)
			let _that = this
			_that.reloadData();
			_that.getPendingTotal()
				.then(res => {
					_that.vTabs[1].badgeText = res.value;
				})
		},
		onShow: function() {
			let _that = this;
			uni.getStorage({
				key: this.serviceJs.flowChangeCache,
				success(res) {
					if (res.data) {
						_that.reloadData();
						_that.getPendingTotal()
							.then(res => {
								_that.vTabs[1].badgeText = res.value;
							})
					}
					uni.removeStorage({
						key: _that.serviceJs.flowChangeCache
					})
				}
			})

		},
		onPageScroll(e) {
			let _that = this;
			_that.scrollTop = e.scrollTop;
			let buttons = _that.buttons;
			if (e.scrollTop > 5) {
				if (_that.buttons.length === 1) {
					buttons.unshift(app.globalData.button.top);
					_that.buttons = buttons;
				}
			} else {
				if (_that.buttons.length === 2) {
					buttons.shift();
					_that.buttons = buttons;
				}
			}
		},
		//页面相关事件处理函数--监听用户下拉动作
		onPullDownRefresh: function() {
			let _that = this;
			_that.reloadData().then(res => {
				uni.stopPullDownRefresh()
				_that.om.toast('刷新成功')
			}, err => {
				uni.stopPullDownRefresh()
			});
		},

		// 页面上拉触底事件的处理函数
		onReachBottom: function() {
			if (!this.pullUpOn) return;
			this.loadding = true;
			let func = ""
			if (this.currentTab == 0) {
				func = 'Launch';
			} else {
				func = 'Pending';
			}
			this.loadData(func);
		}
	};
</script>